<!--
 * @Description: 
 * @Author: Devin
 * @Date: 2021-11-06 17:55:45
 * @LastEditTime: 2021-11-06 17:55:45
 * @LastEditors: Devin
 * @Reference: 
-->
<template>
<div>
  <el-checkbox v-model="checked1" label="advanced" size="large" />
  <tree-list :Arr="Arr" :isAdvanced="checked1"/>
<!--<el-form :inline="false">-->
<!--          <el-form-item  label="item.label  " >-->
<!--            <el-checkbox-group   style="display:inline"  >-->
<!--              <el-checkbox label="Online activities" name="type"/>-->
<!--              <el-checkbox label="Promotion activities" name="type"/>-->
<!--              <el-checkbox label="Offline activities" name="type"/>-->
<!--              <el-checkbox label="Simple brand exposure" name="type"/>-->
<!--            </el-checkbox-group>-->
<!--          </el-form-item>-->
<!--        </el-form>-->
<button @click="save">save</button>
</div>


</template>

<script setup lang="ts">
import {defineComponent, reactive, toRefs, ref} from '@vue/runtime-core';
import treeList from '@/components/Tree.vue'
import { getSelectList } from '@/api/public';
import { ElMessage, ElMessageBox } from 'element-plus'
// const Arr = ref([
//       { id: "1", text: "菜单1", children: [
//           {
//             id: "2", text: "菜单1-1",children: [
//                   {id: "3",  text: "菜单1-1-1"},
//                   {id: "3",  text: "菜单1-1-2"}
//                 ],
//           },
//         ],
//       },
//       { id: "2",text: "菜单2"}
//     ])
var url = './page.json'
const props = {
  // value: 'value',
  id: 'id',
  label: 'label',
  children: 'children',
  // type: 'type'
}
const data1 = [
  {
    id: 1,
    label: 'Level one 1',

    children: [
      {
        id: 4,
        label: 'Level two 1-1',

        children: [
          {
            id: 9,
            label: 'Level three 1-1-1',
            type: "textLine",
            "value": 1,
            "name": "",
          },
          {
            id: 9,
            label: 'Level three 1-1-1',
            type: "select",
            "value": 0,
            "name": "",
          },
          {
            id: 10,
            label: 'Level three 1-1-2',
            type: "checkBox",
            "value": 3,
            "name": "",
          },
        ],
      },
    ]
  }]
const Arr = ref(data1)
// const data = data1
const save = () => {
  console.log(Arr.value)
  // alert(JSON.stringify(Arr.value))
  ElMessageBox.alert(JSON.stringify(Arr.value))
}
const checked1 = ref(true)
import axios, { AxiosInstance } from 'axios';
axios.get('../../../page1.json').then(res => {
  console.log(res)
   Arr.value = res.data.page;
})
</script>
<style scoped lang="scss">

--el-tree-node-hover-bg-color{
  background-color: transparent;
}
.el-tree-node:focus>.el-tree-node__content{
  background-color: transparent !important;
}
</style>
